<!DOCTYPE HTML>
<!-- Original Source Code Copyright © 2011 Joseph T. Parsons. -->

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  <head>
    <title data-contextLabel="brandingTitle">FreezeMedia</title>

    <meta http-equiv="Content-type" value="text/html; charset=utf-8" />
    <meta name="robots" content="index, follow" />
    <meta name="author" content="Joseph Parsons" />
    <meta name="keywords" content="music player, video player, media player, awesomeness" />
    <meta name="description" content="Awesomenss provided by FreezeMedia: we're awesome[ness]." />

    <!-- START Scripts -->
    <!-- More than any other project I've done, the number of scripts found within are simply ridiculous. Eventually we will need to optimise them. But not yet. -->

    <!-- jQuery -->
    <link rel="stylesheet" type="text/css" href="scripts/jquery-ui-1.10.2/themes/absolution/absolution.css" />
    <script src="scripts/jquery-2.0.0.min.js" type="text/javascript"></script>
    <script src="scripts/jquery-ui-1.10.2/ui/jquery-ui.js" type="text/javascript"></script>

    <!-- Database -->
    <script src="scripts/db.js" type="text/javascript"></script>

    <!-- Data Tables -->
    <link rel="stylesheet" type="text/css" href="scripts/datatables-1.9.4/media/css/jquery.dataTables.css" />
    <script src="scripts/datatables-1.9.4/media/js/jquery.dataTables.min.js"></script>
    <script src="scripts/datatables-1.9.4/extras/ColReorder/media/js/ColReorderWithResize.js" type="text/javascript" class="jsbin"></script>
    
    <!-- jPlayer -->
    <link rel="stylesheet" type="text/css" href="scripts/jquery.jplayer.2.3.0/skins/jqueryui/jqueryui.player.css" />
    <script src="scripts/jquery.jplayer.2.3.0/skins/jqueryui/jqueryui.player.js" type="text/javascript"></script>
    <script src="scripts/popcorn-complete.min.js" type="text/javascript"></script>
    <script src="scripts/jquery.jplayer.2.3.0/jquery.jplayer.min.js" type="text/javascript"></script>
    <script src="scripts/jquery.jplayer.2.3.0/popcorn/popcorn.jplayer.js" type="text/javascript"></script>
    
    <!-- Google API -->
    <!-- AIzaSyAyGwlWPBsmDJjRX5mqJl9nTyHI2cptaHw -->
    <script src="https://apis.google.com/js/client.js?onload=load"></script>
    
    <!-- Core -->
    <link rel="stylesheet" type="text/css" href="scripts/styles.css" />
    <script src="scripts/interface.js" type="text/javascript"></script>
    <script src="scripts/core.js" type="text/javascript"></script>

    <!-- END Scripts -->

    <link rel="chrome-application-definition" href="manifest.json" />
  </head>

  <body id="page-wrap" class="ui-widget">
    <nav id="accordion" role="navigation">
      <h1>Pages</h1>
      <div>
        <ul id="menu">
          <li><a href="#page=current">Now Playing</a></li>
          <li><a href="#page=library">Library</a></li>
          <li><a href="#page=import">Import</a></li>
          <li><a href="#page=settings">Settings</a></li>
          <li><a href="#page=faqs">FAQs</a></li>
          <li><a href="#page=license">License</a></li>
        </ul>
      </div>
      <h1>Queue</h1>
      <div>
        Hi!
      </div>
    </nav>
    
    <section id="main-content" role="main">
      <section id="focus-content">
        <section id="current-page" class="page" role="page" page="current">
          This application is highly experimental. It is developed with, for the moment, only Chrome support in mind, because it is an application that is just soooo bleeding edge I really don't care if no other browser supports it right now. Eventually, as features are implemented, I will make sure they work. But, for now, this is a toy. Nothing more.
      
          <div id="mini-player-helper" class="jp-jplayer"></div>
        </section>
        
        <section id="library-page" class="page" role="page" page="library">
          <table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
            <thead>
              <tr>
                <th>T#</th>
                <th>Artist</th>
                <th>Album</th>
                <th>Title</th>
              </tr>
            </thead>
            <tbody>
            </tbody>
          </table>
        </section>
        
        <section id="settings-page" class="page" role="page" page="settings">
          <div id="settingsTabs">
            <ul>
              <li><a href="#page=settings,tab=interface">Interface</a></li>
              <li><a href="#page=settings,tab=library">Library</a></li>
              <li><a href="#page=settings,tab=playback">Playback</a></li>
              <li><a href="#page=settings,tab=storage">Storage</a></li>
            </ul>
            
            <div id="page=settings,tab=interface">
              <fieldset>
                <legend>Interface Settings</legend>
                
                Enable Lyrics<br /><br />
                Enable WikiPedia<br /><br />
              </fieldset>
            </div>
            
            <div id="page=settings,tab=library">
              <fieldset>
                <legend>Library Settings</legend>                
                Enable Combined Tracks<br /><br />
                Combined Tracks Algorithm<br /><br />
                Preferrence for Combined Tracks<br /><br />
                
                Attempt to Play Local Library Tracks from YouTube<br /><br />
              </fieldset>
            </div>
            
            <div id="page=settings,tab=playback">
              <fieldset>
                <legend>Playback Settings</legend>
                
                Enable Flash Drivers<br /><br />
                Enable Third-Party Drivers<br /><br />
                Enable Audio Visualisations<br /><br />
              </fieldset>
            </div>
            
            <div id="page=settings,tab=storage">
              <fieldset>
                <legend>Storage Settings</legend>
                [Clear Browser Storage]<br /><br />
                [Clear Browser Index]<br /><br />
                
                [Export Browser Index]<br /><br />
                [Import Browser Index]<br /><br />
              </fieldset>
            </div>
        </section>

        <section id="import-page" class="page" role="page" page="import">
          <div id="importTabs">
            <ul>
              <li><a href="#page=import,tab=upload">Upload</a></li>
              <li><a href="#page=import,tab=sync">Syncronise</a></li>
              <li><a href="#page=import,tab=link">Link</a></li>
            </ul>
            
            <div id="page=import,tab=upload">
              <fieldset>
                <legend>Upload Files</legend>
                You may upload files from your computer to the library. <strong>Warning:</strong> Due to browser limitations, you will need to "re-import" these files every time you relaunch the application, unless you select "Make a Copy" below. This will save the copies in the application's storage, but will duplicate the file on your hard drive, and may require considerably extra space.<br /><br />
                
                <form>
                  Choose a Directory: <input type="file" name="file_input[]" id="file_input" multiple="" webkitdirectory="" /><br />
                  Make a Copy?: <input type="checkbox" name="make-a-copy" /><br /><br />
                  
                  <input type="submit" value="Submit" />
                </form>
              </fieldset>
            </div>
            <div id="page=import,tab=sync">
              <fieldset>
                <legend>Sync Files</legend>
                  Connect to DropBox or Google Drive and you will able to access files from these services.<br /><br />
              </fieldset>
            </div>
            <div id="page=import,tab=link">
              <fieldset>
                <legend>Link Files</legend>
                Save a "link" to files from YouTube or Google Music. <strong>Warning:</strong> These services are not standard, and the files may be lost unexpectantly.<br /><br />
              </fieldset>
            </div>
          </div>
        </section>

        <section id="faqs-page" class="page" role="page" page="faqs">
        </section>

        <section id="license-page" class="page" role="page" page="license">
          <div id="licenseTabs">
            <ul>
              <li><a href="#page=license,tab=freezeplayer">FreezePlayer</a></li>
              <li><a href="#page=license,tab=jquery">jQuery</a></li>
              <li><a href="#page=license,tab=jplayer">jPlayer</a></li>
              <li><a href="#page=license,tab=datatables">Data Tables</a></li>
              <li><a href="#page=license,tab=aurora">Aurora</a></li>
            </ul>
        </section>
      </section>

      <section id="mini-player">
        <div class="jp-gui ui-widget ui-widget-content ui-corner-all">
          <ul>
            <li class="jp-play ui-state-default ui-corner-all"><a href="javascript:;" class="jp-play ui-icon ui-icon-play" tabindex="1" title="play">play</a></li>
            <li class="jp-pause ui-state-default ui-corner-all"><a href="javascript:;" class="jp-pause ui-icon ui-icon-pause" tabindex="1" title="pause">pause</a></li>
            <li class="jp-stop ui-state-default ui-corner-all"><a href="javascript:;" class="jp-stop ui-icon ui-icon-stop" tabindex="1" title="stop">stop</a></li>
            <li class="jp-repeat ui-state-default ui-corner-all"><a href="javascript:;" class="jp-repeat ui-icon ui-icon-refresh" tabindex="1" title="repeat">repeat</a></li>
            <li class="jp-repeat-off ui-state-default ui-state-active ui-corner-all"><a href="javascript:;" class="jp-repeat-off ui-icon ui-icon-refresh" tabindex="1" title="repeat off">repeat off</a></li>
            <li class="jp-mute ui-state-default ui-corner-all"><a href="javascript:;" class="jp-mute ui-icon ui-icon-volume-off" tabindex="1" title="mute">mute</a></li>
            <li class="jp-unmute ui-state-default ui-state-active ui-corner-all"><a href="javascript:;" class="jp-unmute ui-icon ui-icon-volume-off" tabindex="1" title="unmute">unmute</a></li>
            <li class="jp-volume-max ui-state-default ui-corner-all"><a href="javascript:;" class="jp-volume-max ui-icon ui-icon-volume-on" tabindex="1" title="max volume">max volume</a></li>
          </ul>
          
          <div class="jp-progress-slider"></div>
          <div class="jp-volume-slider"></div>
          <div class="jp-current-time"></div>
          <div class="jp-duration"></div>
          <div class="jp-clearboth"></div>
        </div>
        <div class="jp-no-solution">
          <span>Update Required</span>
          To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
        </div>
      </section>
    </section>
  </body>
</html>